<div class="container">
  <div class="row justify-content-center">
    <div class="col-xl-4 col-md-5">
      <div class="card">
        <div class="card-body p-4">
          <div class="text-center w-75 mx-auto auth-logo mb-4">
            <a href="index.html" class="logo-dark">
              <span
                ><img src="../../assets/images/logo-sm.png" alt="" height="22"
              /></span>
            </a>

            <a href="index.html" class="logo-light">
              <span
                ><img src="../../assets/images/logo-sm.png" alt="" height="22"
              /></span>
            </a>
          </div>

          <form action="/">
            <div class="form-group mb-3">
              <label class="form-label" for="username">用户名</label>
              <input
                class="form-control"
                type="text"
                id="username"
                required=""
                placeholder="输入你的用户名"
              />
            </div>

            <div class="form-group mb-3">
              <label class="form-label" for="emailaddress">邮箱</label>
              <input
                class="form-control"
                type="email"
                id="emailaddress"
                required=""
                placeholder="输入你的邮箱"
              />
            </div>

            <div class="form-group mb-3">
              <label class="form-label" for="role">角色</label>
              <select class="form-control" id="role" required>
                <option value="" disabled selected>请选择你的角色</option>
                <option value="user">消费者</option>
                <option value="guest">农户</option>
              </select>
            </div>

            <div class="form-group mb-3">
              <a
                href="../../../pages-demo/pages-recoverpw.html"
                class="text-muted float-end"
                ><small></small
              ></a>
              <label class="form-label" for="password">密码</label>
              <input
                class="form-control"
                type="password"
                required=""
                id="password"
                placeholder="输入你的密码"
              />
            </div>

            <div class="form-group mb-3">
              <div class="">
                <input
                  class="form-check-input"
                  type="checkbox"
                  id="checkbox-signin"
                  checked
                />
                <label class="form-check-label ms-2" for="checkbox-signin"
                  >我接受<a href="">条款和条件</a></label
                >
              </div>
            </div>

            <div class="form-group mb-0 text-center">
              <button
                id="btnSignUp"
                class="btn btn-primary w-100"
                type="button"
              >
                注册
              </button>
            </div>
          </form>
        </div>
        <!-- end card-body -->
      </div>
      <!-- end card -->

      <div class="row mt-3">
        <div class="col-12 text-center">
          <p class="text-white-50">
            已经有账户？
            <a href="#/login" class="text-white font-weight-medium ms-1"
              >登录</a
            >
          </p>
        </div>
        <!-- end col -->
      </div>
      <!-- end row -->
    </div>
    <!-- end col -->
  </div>
  <!-- end row -->
</div>
